<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org/">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 设置网站标题 -->
    <title>小米账号-登录</title>
    <!-- 设置网站图标 -->
    <link rel="icon" href="/images/favicon/favicon.ico">
    <!-- 引入重置样式表 -->
    <link rel="stylesheet" href="/css/reset.css">
    <!-- 引入login.css -->
    <link rel="stylesheet" href="/css/login.css">
    <script src="/js/jq_3.3.1_mi.js"></script>
    <script src="/mylayer.js"></script>
    <script type="text/javascript" src="/layui/layui.js"></script>
    <script src="/js/detail.js"></script>
</head>
<body>
    <div class="wrap">
        <!-- 左边背景 -->
        <div class="wrap_bg"></div>
        <!-- 右边登录的内容 -->
        <div class="login">
            <!-- 上标题 -->
            <div class="login_hd">
                <div class="hd_left">
                    <img src="/images/logo-mi2.png" class="logo">
                    小米帐号
                </div>

                <ul class="hd_right">
                    <li><a href="#">用户协议</a></li>
                    <li><a href="#">隐私政策</a></li>
                    <li><a href="#">帮助中心</a></li>
                    <li><a href="#">中文(简体)</a></li>
                </ul>
            </div>

            <div class="login_box">
                <div id="loginFrom" class="login_card">
                    <form class="layui-form" action="">
                    <img src="/images/two.png" class="two">
                    <h2 class="title">登录</h2>
                    <!-- 账号 -->
                    <div class="user_box">
                        <div class="user">
                            <input name="name" type="text" id="u" class="username">
                            <label for="u">邮箱/手机号码/小米ID</label>
                        </div>
                        <div class="user_msg">请输入账号</div>
                    </div>
                    <!-- 密码 -->
                    <div class="user_box">
                        <div class="user">
                            <input name="password" type="password" id="u" class="password">
                            <label for="u">密码</label>
                        </div>
                        <div class="user_msg">请输入密码</div>
                    </div>
                    <!-- 登录按钮 -->
                    <button type="button" class="login_btn" lay-submit lay-filter="submitLogin">登录</button>
                    <!-- 登录说明 -->
                    <div class="login_other">
                        <a href="#" class="l_l">忘记密码？</a>
                        <a href="#" class="l_right">手机号登录</a>
                    </div>
                    <!-- 登录方式 -->
                    <div class="login_method">
                        <h3>其他登录方式</h3>
                        <div class="method_list">
                            <a href="#"><img src="/images/qq.png" alt=""></a>
                            <a href="#"><img src="/images/wx1.png" alt=""></a>
                            <a href="#"><img src="/images/sina.png" alt=""></a>
                        </div>
                    </div>
                  </form>
                </div>
            </div>
        </div>
    </div>

    <script>
        layui.use(['layer','form'], function(){
            var layer = layui.layer;
            var form = layui.form;

            var queryString = window.location.search;
            var urlParams = new URLSearchParams(queryString);
            var returnURI = urlParams.get("returnURI");

            form.on('submit(submitLogin)',function (data){
                var field = data.field;
                $.post(
                    '/user/login',
                    field,
                    function (result){
                        console.log(result);
                        if(result.code==0){
                            console.log(returnURI)
                            mylayer.okUrl(result.msg,returnURI);
                        }else{
                            mylayer.errorMsg(result.msg);
                        }
                    }
                    ,'json'
                );
                return false;
            });
        });
    </script>
</body>
</html>